<template>
    <div ref="demo1" id="barChart" style="width: 100%; height: 400px;">
        <h1>99999</h1>
    </div>
</template>

<script>
export default {
    name: 'demo',
    mounted() {
        this.renderBarChart();
    },
    methods: {


        renderBarChart() {

            // 获取柱状图容器
            const chartContainer = document.getElementById('barChart');
            // 初始化 echarts 实例

            const chart = this.$echarts.init(chartContainer);

            // 柱状图配置项
            const options = {
                xAxis: {
                    type: 'category',
                    data: ['Mon1', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
                },
                yAxis: {
                    type: 'value'
                },
                series: [
                    {
                        data: [120, 200, 150, 80, 70, 110, 130],
                        type: 'bar'
                    }
                ]
            };

            // 渲染图表
            chart.setOption(options);
        }
    }

}
</script>

<style></style>